<!DOCTYPE html>
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <link rel="stylesheet" href="../theme/default/style.css" type="text/css">
    <link rel="stylesheet" href="style.css" type="text/css">
    <script src="../lib/OpenLayers.js"></script>
    <script type="text/javascript">
        var lon = 50;
        var lat = 0;
        var zoom = 0;
        var map, layer;

        function init(){
            OpenLayers.DOTS_PER_INCH = 72;
            var options = {

// various ways of specifying similar things
//                          resolutions: [1.40625,0.703125,0.3515625,0.17578125,0.087890625,0.0439453125,0.02197265625,0.010986328125,0.0054931640625,0.00274658203125,0.00137329101],
//                          scales: [50000000, 10000000],
//                          maxResolution: 0.17578125,
//                          minResolution: 0.0439453125,
//                          maxScale: 10000000,
//                          minScale: 50000000,
//                          numZoomLevels: 5,
//                          units: "dd",
                            minResolution: "auto",
                            minExtent: new OpenLayers.Bounds(-1, -1, 1, 1),
                            maxResolution: "auto",
                            maxExtent: new OpenLayers.Bounds(-180, -90, 180, 90)
                          };

            map = new OpenLayers.Map( 'map' , options);


            layer = new OpenLayers.Layer.WMS( "OpenLayers WMS",
                    "http://vmap0.tiles.osgeo.org/wms/vmap0", {layers: 'basic'});
            map.addLayer(layer);


            map.setCenter(new OpenLayers.LonLat(lon, lat), zoom);
        }

    </script>
  </head>
  <body onload="init()">
    <h1 id="title">Zoom Level</h1>

    <div id="tags">
        zoom, zoomlevel, resolution, scale, cleanup
    </div>

    <p id="shortdesc">
        This example shows the use of the resolutions layer option on a number of layer types.
    </p>

    <div id="map" class="smallmap"></div>

    <div id="docs">
        <p>
            Set the extent of the viewable map using preset levels of scale available
            to the user via the zoom slider bar. You can set the minimum, maximum
            scales or resolutions, the number of levels in between and the minimum
            and maximum geographic extents in your map's units.
        </p>
        <p>
        Default units for Scale are in inches. Resolution is specified in map units
        per pixel where the default map units are decimal degrees(dd).<br>
        scale = resolution * OpenLayers.INCHES_PER_UNIT[units] *
                    OpenLayers.DOTS_PER_INCH <br>
        You can either set the scale or the resolution, there is no need to set both.
        </p>
        <p>
          You can do it with a ...
        </p>
    </div>

  </body>
</html>
